<template>
    <div>
        <!-- 管理页面头部 begin -->
        <MemberHeaderView></MemberHeaderView>
        <!-- 管理页面头部 end -->

        <div class="i_bg bg_color">
            <!-- 管理页面中部 begin -->
            <div class="m_content">
                <AdminContentLeft @changeView="currentRightComponent = $event" />
                <component :is="currentRightComponent" :productId="currentProductId" :userType="Number(userType)"
                    :fromAdmin="true" @changeView="handleChangeView" />
            </div>
            <!-- 管理页面中部 end -->
            <!-- 管理页面底部 begin -->
            <FooterView></FooterView>
            <!-- 管理页面底部 end -->
        </div>
    </div>
</template>

<script>
import MemberHeaderView from './MemberHeaderView.vue';
import FooterView from './FooterView.vue';
import AdminContentLeft from '@/components/AdminContentLeft.vue';
import MemberNewsListRight from '@/components/MemberNewsListRight.vue';
import MemberProductListRight from '@/components/MemberProductListRight.vue';
import MemberProductAddRight from '@/components/MemberProductAddRight.vue';
import MemberProductSortRight from '@/components/MemberProductSortRight.vue';
import MemberOrderListRight from '@/components/MemberOrderListRight.vue';
import MemberUserListRight from '@/components/MemberUserListRight.vue';
import MemberProductUpdateRight from '@/components/MemberProductUpdateRight.vue';

export default {
    name: 'MemberNewsListView',
    components: {
        MemberHeaderView,
        FooterView,
        AdminContentLeft,
        MemberNewsListRight,
        MemberProductListRight,
        MemberProductAddRight,
        MemberProductSortRight,
        MemberOrderListRight,
        MemberUserListRight,
        MemberProductUpdateRight
    },
    data() {
        return {
            currentRightComponent: 'MemberNewsListRight', // 默认显示资讯列表
            currentProductId: null,
            userType: window.sessionStorage.getItem('userType') || '0'
        }
    },
    methods: {
        handleChangeView(event) {
            if (typeof event === 'string') {
                this.currentRightComponent = event;
            } else if (event.component) {
                this.currentRightComponent = event.component;
                this.currentProductId = event.productId || null;
            }
        }
    },
    mounted() {
        const tab = this.$route.query.tab;

        const tabMap = {
            order: 'MemberOrderListRight',
            product: 'MemberProductListRight',
            user: 'MemberUserListRight',
            news: 'MemberNewsListRight'
        };

        this.currentRightComponent = tabMap[tab] || 'MemberNewsListRight';

        console.log('✅ AdminControllerView 已加载，当前组件：', this.currentRightComponent);
    },
    watch: {
        '$route.query.tab'(newTab) {
            const tabMap = {
                order: 'MemberOrderListRight',
                product: 'MemberProductListRight',
                user: 'MemberUserListRight',
                news: 'MemberNewsListRight'
            };
            this.currentRightComponent = tabMap[newTab] || 'MemberNewsListRight';
        }
    }
}
</script>